<!DOCTYPE html>
<html lang="en" xmlns="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
  <link rel="stylesheet" href="../css/mystore.css">
  <title>Mypetstore</title>
</head>
<body>
<div th:replace="~{common/top}"></div>
<div id="BackLink">
  <a href="/catalog/index" class="btn"><i class="fa-solid fa-chevron-left"></i>Return to Main Menu</a>
</div>

<div class="Catalog">

  <h2 th:text="${category.categoryName}">Category Name</h2>

  <table>
    <tr>
      <th>Product ID</th>
      <th>Name</th>
    </tr>

    <tr th:each="product:${category.productList}">
      <td><a th:href="@{/catalog/viewProduct?productId=}+${product.productId}" th:text="${product.productId}">Product
        ID</a></td>
      <td th:text="${product.name}">Product Name</td>
    </tr>
  </table>
</div>
<footer th:replace="~{common/bottom}"></footer>
</body>
</html>